<template>
	<view id="mapView" style="width: 100%;height: 100vh;">
	</view>
</template>
<script>
	export default {
		name: '',
		data() {
			return {}
		},
		onLoad() {
			this.$nextTick(() => {
				this.initMap()
			})
		},
		methods: {
			initMap() {
				// 创建地图
				let map = new qq.maps.Map(document.getElementById("mapView"), {
					//是地图中心经纬度
					center: new qq.maps.LatLng(39.9, 116.4),
					zoom: 7, //范围
				});
				// 创建热力图对象
				let heat = new qq.maps.visualization.Heat({
					map: map, // 必填参数，指定显示热力图的地图对象
					radius: 30, // 辐射半径，默认为20
				});
				// 获取热力数据
				let data = {
					max: 100,
					min: 0,
					data: [{
							lat: 40.07,
							lng: 115.97,
							value: 50, //程度，大小自定义
						},
						{
							lat: 40.77,
							lng: 115.7,
							value: 100
						}
					]
				}
				// 向热力图传入数据
				heat.setData(data);

			}
		}
	}
</script>

<style>
	.index {
		width: 100%;
		height: 100%;
	}
</style>